Vue Router の beforeRouteLeave() をちょっとだけ勉強する
結構いい変数名な気がする
Finally, you can directly define route navigation guards inside route components (the ones passed to the router configuration)
コンポーネント単位で route navigation guard を行う場合に使うやつっぽい
code:vue
<script>
export default {
beforeRouteEnter(to, from) {
// called before the route that renders this component is confirmed.
// does NOT have access to this component instance,
// because it has not been created yet when this guard is called!
},
beforeRouteUpdate(to, from) {
// called when the route that renders this component has changed, but this component is reused in the new route.
// For example, given a route with params /users/:id, when we navigate between /users/1 and /users/2,
// the same UserDetails component instance will be reused, and this hook will be called when that happens.
// Because the component is mounted while this happens, the navigation guard has access to this component instance.
},
beforeRouteLeave(to, from) {
// called when the route that renders this component is about to be navigated away from.
// As with beforeRouteUpdate, it has access to this component instance.
},
}
</script>
// called when the route that renders this component is about to be navigated away from.
// As with beforeRouteUpdate, it has access to this component instance.
navigated away from がよくわからない
ブラウザの戻る機能ってことか？
ブラウザの戻る機能には対応してそう
どうにもコンポーネントが unmount されるかどうかを見ているっぽい
つまり、
<RouterLink /> のクリック
プログラムによる遷移メソッド
router.push()
router.replace()
router.go()
...
ブラウザの「戻る」「進む」ボタン
親ルートから子ルートへの移動などで、親が消える時(？)
これ何？
パス的には親子関係だけど、<RouterView /> を使用しないで別のコンポーネントに置き換えるときとか
アドレスバーを活用して直接 URL を変更したり、ブラウザのリロードとかには対応していない